{% include "../include/head.html" %}

<body>
    <!-- 侧滑导航根容器 -->
    <div id="content-wrap" class="mui-off-canvas-wrap mui-slide-in">
        <!--顶部-->
        {% include "../include/header.html" %}
        <div class="mui-inner-wrap">
            <div class="float-info" style="display: none;">已为您推荐15篇文章</div>

            <!--导航-->
            <nav class="nav">
                <ul>
                    <li data-id="0" class="active"><a href="javscript:void(0)">推荐</a></li>
                    {% for item in catList %}
                    <li data-id="{{loop.index}}" {% if item.id==0 %}class="active" {% endif %}><a href="javscript:void(0)">{{item.name}}</a></li>
                    {% endfor %}
                </ul>
                <div class="nav-arrow">
                    <img src="public/static/imgs/arrow.png">
                </div>
            </nav>

            <!--轮播图-->
            <div id="slider" class="mui-slider">
                <div class="mui-slider-group">
                    <!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
                    {% for item in sliderList %}
                    <div class="mui-slider-item">
                        <a href="/news/5453.html">
                            <img src="http://test1.ngzb.com.cn{{item.cover}}">
                            <p class="mui-slider-title">{{item.title}}</p>
                        </a>
                    </div>
                    {% endfor %}
                </div>
                <div class="mui-slider-indicator mui-text-right">
                    <div class="mui-indicator mui-active"></div>
                    <div class="mui-indicator"></div>
                    <div class="mui-indicator"></div>
                </div>
            </div>

            <!--文章列表-->
            <div class="content-list">
                {% for item in firstList %}
                <section class="content-area content-area10101">
                    <div class="img-area">
                        <a href="/newsdetail/{{ item.news_id }}"><img src="http://test1.ngzb.com.cn{{ item.cover }}"></a>
                    </div>
                    <div class="txt-area">
                        <a href="/newsdetail/{{ item.id }}">
                            <p class="txt-area-title">{{ item.title }}</p>
                        </a>
                        <div class="txt-area-mark">
                            <!--<span>热</span>
                    <span>顶置</span>
                    <span>专题</span>-->
                            <div class="txt-area-mark-right">
                                <i>v</i>
                                <b>{{ item.from }}</b>
                            </div>
                        </div>
                    </div>
                </section>
                {% endfor %}
            </div>

            <div class="mui-off-canvas-backdrop"></div>
        </div>
    </div>

    <script src="public/static/js/home.js?v=1"></script>
</body>

</html>